import React from 'react';
import { connect } from 'react-redux';
import { BROWSER_MODE } from 'Constants/webConstants';
import './index.scss';

class HomePage extends React.PureComponent {
  render() {
    const isVertical = BROWSER_MODE.isVertical(this.props.mode);
    if (isVertical) {
      return (
        <div className="v-home-wrap" >
          <img src="images/vertical/fruit.png" alt="" className="fruit" />
          <img src="images/vertical/phone.png" alt="" className="phone" />
        </div>
      );
    }
    return (
      <div className="home-horizon-wrap">
        <div className="homw-content">
          <img src="images/horizonImg/home_fruit.png" alt="" />
        </div>
        <img src="images/horizonImg/home_right.png" alt="" className="side-right" />
        <img src="images/horizonImg/home_hand.png" alt="" className="hand-img" />
      </div>
    );
  }
}

function mapStateToProps(state) {
  return {
    ...state.webReducer,
  };
}

export default connect(mapStateToProps)(HomePage);
